<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算属性和监听</title>
</head>
<body>
<div id="app">
    计算属性如果依赖不变的话，它就会变成缓存，computed 的值就不会重新计算<br/>
    生日:{{birthday}}  <br/>
    计算属性:{{birth}}<br/>
    Vue中可以使用监听器监听已有属性的变化(监听了未定义的属性也不会报错)，并根据属性的变化作出响应。<br/>
    <input type="text" v-model="message">
</div>
</body>
<script src="./node_modules/vue/dist/vue.js"></script>
<script>
    var app =new Vue({
        el:"#app",
        data:{
            birthday:1529032123201 ,// 毫秒值
            message:"",
        },
        computed: {
            birth() {// 计算属性本质是一个方法，但是必须返回结果  只调用一个
                console.log("birth.......");
                const d = new Date(this.birthday);
                return d.getFullYear() + "-" + d.getMonth() + "-" + d.getDay();
            }
        },  watch:{
            message(newVal, oldVal){   //message需要和data的属性值一样
                console.log(newVal, oldVal);
            }
        }

    });
</script>
</html>